<template lang="pug">
    skin(@up="up",@down="down",@yes="yes",@back="back",@duringUp="up",@duringDown="down")
        div(class="flex-column h3")
            div(class="flex-column-item") 
              div(class="flex-row")
                div(div class="flex-row-item  flex-center-center flex-7") ----医生设置----
                div(div class="flex-row-item right") {{activeId+1}}
            div(class="flex-column-item flex-center flex-3") 
              div(class="flex-row")
                  div(class="flex-row-item flex-7",style="height:100%")
                      div(class="flex-column")
                        div(class="flex-column-item",v-for="(menu,index) in currentPageMenus")
                          div(class="flex-row")
                            div(class="flex-row-item flex-3",style="font-size:0.9em") 
                              span(class="iconfont",:style="{'visibility': index == currentMenuIndex ? 'visible' : 'hidden'}") &#xe62c;
                              span {{menu.name}}
                            div(class="flex-row-ietm center flex-0",v-if="!menu.to") 
                              control-select(v-model="currentPageMenus[index]", :ref="'ref' + menu.id", :working="menu.working",v-if="!menu.isControlAmount")
                              control-amount(v-model="currentPageMenus[index]", :ref="'ref' + menu.id", :working="menu.working",v-else)
                            div(class="flex-row-ietm center flex-0",v-if="!menu.to") 
                              span {{menu.unit}}

                  div(class="flex-row-item right",style="height:100%")
                    control-line(:total="menus.length",:current="activeId",style="float:right;")

        
</template>

<script>
import MenuList from '@/mixins/MenuList'
export default {
  mixins:[MenuList],
  data() {
    return {
      menus: [
        {
          name: "大剂量限",
          isControlAmount: true,
          max: 85,
          min: 0,
          increment: 1,
          unit: "u",
          value: window.advance.doseLimit,
          attachUnit: true,
          working: false,
          id: 1,
          onChange(model) {
            window.advance.doseLimit = model.value;
          }
        },
        
        {
          name: "日总量限",
          value: window.advance.dayDoseLimit,
          isControlAmount: true,
          max: 200,
          min: 0,
          increment: 5,
          unit: "u",
          attachUnit: true,
          working: false,
          id: 2,
          onChange(model) {
            window.advance.dayDoseLimit = model.value;
          }
        },
        {
          name: "基础分段",
          value: window.advance.baseLimit,
          isControlAmount: false,
          unit: "",
          options: [{ name: "24", value: "24" }, { name: "48", value: "48" }],
          attachUnit: true,
          working: false,
          id: 3,
          onChange(model) {
            window.advance.baseLimit = model.value;
          }
        },
        {
          name: "三餐模式",
          value: window.advance.threeMealMode,
          options: [{ name: "关", value: false }, { name: "开", value: true }],
          working: false,
          id: 4,
          onChange(model) {
            window.advance.threeMealMode = model.value;
          }
        },
        {
          name: "脉冲周期",
          value: window.advance.pulsePeriod,
          unit: "s",
          options: [
            { name: "20", value: "20" },
            { name: "15", value: "15" },
            { name: "10", value: "10" },
            { name: "05", value: "05" },
            { name: "00", value: "00" },
          ],
          working: false,
          id: 5,
          onChange(model) {
            window.advance.pulsePeriod = model.value;
          }
        },
        {
          name: "菜单设置",
          to: '/advance-setting/menu'
        }
      ],
      visible: false,
      currentItem: null,
      currentItemIndex: 0
    };
  },
  computed:{
    currentMenuRef(){
      return "ref" + this.currentMenu.id
    },
  },
  
  methods: {
    up() {
      if (this.currentMenu.working) {
        this.$refs[this.currentMenuRef][0].up();
        return;
      }

       this.activeId--;
    },
    down() {
      if (this.currentMenu.working) {
         this.$refs[this.currentMenuRef][0].down();
         return;
      }

      this.activeId ++;
    },

    back() {
      if (this.currentMenu.working) {
        this.currentMenu.working = false;
      } else {
        this.$router.push("/menu/menu/index?index=5");
      }
    },
    yes() {
      if(this.currentMenu.to) {
        this.$router.push(this.currentMenu.to);
        return;
      }

      this.currentMenu.working = !this.currentMenu.working;
    }
  }
};
</script>

<style lang="less">
</style>
